<template>
    <a-form ref="form" :model="emp" size="large"
            label-align="right"
            :label-col-props="{span:6,offset:0}"
            :wrapper-col-props="{span:18,offset:0}"
            @submit="addOrEditEmp"
    >
        <a-row :gutter="8">
            <a-col :span="6">
                <a-form-item field="name" label="员工名称"
                             :rules="[{required:true,message:'员工名称必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.name" placeholder="员工名称">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="gender" label="性别"
                             :rules="[{required:true,message:'性别必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.gender">
                        <a-option>女</a-option>
                        <a-option>男</a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="birthday" label="生日"
                             :rules="[{required:true,message:'生日必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-date-picker v-model="emp.birthday"/>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="idCard" label="身份证号"
                             :rules="[{required:true,message:'身份证号必填'},{length:18,message:'18位'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.idCard" placeholder="身份证号">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="wedlock" label="婚姻状况"
                             :rules="[{required:true,message:'婚姻状况必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.wedlock">
                        <a-option>已婚</a-option>
                        <a-option>未婚</a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="nationId" label="民族"
                             :rules="[{required:true,message:'民族必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.nationId">
                        <a-option v-for="(item,index) in nations" :key="item.id" :value="item.id"
                                  :label="item.name"></a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="nativePlace" label="籍贯"
                             :rules="[{required:true,message:'籍贯必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.nativePlace" placeholder="籍贯">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="politicId" label="政治面貌"
                             :rules="[{required:true,message:'政治面貌必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.politicId">
                        <a-option v-for="(item,index) in politics" :key="item.id" :value="item.id"
                                  :label="item.name"></a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="email" label="邮箱"
                             :rules="[{required:true,message:'邮箱必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.email" placeholder="邮箱">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="phone" label="手机号"
                             :rules="[{required:true,message:'手机号必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.phone" placeholder="手机号">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="address" label="地址"
                             :rules="[{required:true,message:'地址必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.address" placeholder="地址">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="departmentId" label="部门"
                             :rules="[{required:true,message:'部门必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-tree-select
                            :data="departments"
                            v-model="emp.departmentId"
                            placeholder="请选择部门"
                    ></a-tree-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="jobLevelId" label="职称"
                             :rules="[{required:true,message:'职称必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.jobLevelId">
                        <a-option v-for="(item,index) in joblevels" :key="item.id" :value="item.id"
                                  :label="item.name"></a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="posId" label="职位"
                             :rules="[{required:true,message:'职位必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.posId">
                        <a-option v-for="(item,index) in positions" :key="item.id" :value="item.id"
                                  :label="item.name"></a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="engageForm" label="聘用形式"
                             :rules="[{required:true,message:'聘用形式必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.engageForm">
                        <a-option>全职</a-option>
                        <a-option>兼职</a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="tiptopDegree" label="学历"
                             :rules="[{required:true,message:'学历必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.tiptopDegree">
                        <a-option>大学</a-option>
                        <a-option>高中</a-option>
                        <a-option>初中</a-option>
                        <a-option>小学</a-option>
                        <a-option>硕士</a-option>
                        <a-option>博士</a-option>
                        <a-option>博士后</a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="specialty" label="专业"
                             :rules="[{required:true,message:'专业必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.specialty" placeholder="专业">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="school" label="学校"
                             :rules="[{required:true,message:'学校必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.school" placeholder="学校">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="beginDate" label="入职日期"
                             :rules="[{required:true,message:'入职日期必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-date-picker v-model="emp.beginDate"/>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="workState" label="在职状态"
                             :rules="[{required:true,message:'在职状态必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.workState">
                        <a-option>在职</a-option>
                        <a-option>离职</a-option>
                    </a-select>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="conversionTime" label="转正日期"
                             :rules="[{required:true,message:'转正日期必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-date-picker v-model="emp.conversionTime"/>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="notWorkDate" label="离职日期"
                             :rules="[{required:true,message:'离职日期必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-date-picker v-model="emp.notWorkDate"/>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="beginContract" label="合同开始"
                             :rules="[{required:true,message:'合同开始日期必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-date-picker v-model="emp.beginContract"/>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="endContract" label="合同终止"
                             :rules="[{required:true,message:'合同终止日期必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-date-picker v-model="emp.endContract"/>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="workId" label="工号"
                             :rules="[{required:true,message:'工号必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input disabled v-model="emp.workId" placeholder="工号">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="workAge" label="工龄"
                             :rules="[{required:true,message:'工龄必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-input v-model="emp.workAge" placeholder="工龄">
                    </a-input>
                </a-form-item>
            </a-col>
            <a-col :span="6">
                <a-form-item field="salaryId" label="账套"
                             :rules="[{required:true,message:'账套必填'}]"
                             :validate-trigger="['change','input']"
                >
                    <a-select v-model="emp.salaryId">
                        <a-option v-for="(item,index) in salarys" :key="item.id" :value="item.id"
                                  :label="item.name"></a-option>
                    </a-select>
                </a-form-item>
            </a-col>
        </a-row>
        <a-row style="height: 60px;width:100%;position: fixed;bottom: 5%;right: 1%;">
            <a-col :span="20">&nbsp;</a-col>
            <a-col :span="2">
                <a-button @click="$emit('cancel')">取消</a-button>
            </a-col>
            <a-col :span="2">
                <a-button type="primary" html-type="submit">确认</a-button>
            </a-col>
        </a-row>
    </a-form>
</template>

<script>
    export default {
        name: "",
        props: {
            type: {
                type: String,
                required: true,
                default: 'add'
            },
            editEmp: {
                type: Object,
                required: false,
                default: {
                    name: ''
                }
            },
            departments: {
                type: Array,
                required: true,
            }
        },
        emits: ['success', 'cancel'],
        data() {
            return {
                emp: {
                    name: "",
                    gender: "女",
                    birthday: this.$moment(new Date()).format('YYYY-MM-DD'),
                    idCard: "410xxx19xx0101xxxx",
                    wedlock: "未婚",
                    nationId: 4,
                    nativePlace: "郑州",
                    politicId: 2,
                    email: "xxxx@qq.com",
                    phone: "1300000xxxx",
                    address: "地址",
                    departmentId: 6,
                    jobLevelId: 1,
                    posId: 1,
                    engageForm: "全职",
                    tiptopDegree: "高中",
                    specialty: "某专业",
                    school: "某学校",
                    beginDate: this.$moment(new Date()).format('YYYY-MM-DD'),
                    workState: "在职",
                    workId: '10000000',
                    conversionTime: this.$moment(new Date()).format('YYYY-MM-DD'),
                    notWorkDate: this.$moment(new Date()).format('YYYY-MM-DD'),
                    beginContract: this.$moment(new Date()).format('YYYY-MM-DD'),
                    endContract: this.$moment(new Date()).format('YYYY-MM-DD'),
                    workAge: "无限",
                    salaryId: 1
                },
                nations: [],
                politics: [],
                joblevels: [],
                positions: [],
                salarys: []
            }
        },
        watch: {
            'editEmp'() {
                this.emp = this.$DeepCopy(this.editEmp)
            }
        },
        methods: {
            initNations() {
                this.$get(this.requestUrl.getAllNations.url).then(res => {
                    this.nations = res.obj
                })
            },
            initPolitics() {
                this.$get(this.requestUrl.getPoliticsStatus.url).then(res => {
                    this.politics = res.obj
                })
            },
            initJoblevels() {
                this.$get(this.requestUrl.getAllJoblevelsInEmp.url).then(res => {
                    this.joblevels = res.obj
                })
            },
            initPositions() {
                this.$get(this.requestUrl.getPositions.url).then(res => {
                    this.positions = res.obj
                })
            },
            initSalarys() {
                this.$get(this.requestUrl.getAllSalarys.url).then(res => {
                    this.salarys = res.obj
                })
            },
            initWorkId() {
                this.$get(this.requestUrl.getMaxWorkId.url).then(res => {
                    this.emp.workId = res.obj.toString()
                })
            },
            addOrEditEmp({values, errors}) {
                if (!errors) {
                    let fun = this.$post
                    let url = this.requestUrl.addEmp.url
                    if (this.type === 'edit') {
                        fun = this.$put
                        url = this.requestUrl.updateEmp.url
                        this.emp.createDate = ''
                    }
                    fun(url, this.emp).then(res => {
                        this.emp = {
                            name: '',
                            remark: ''
                        }
                        this.$message.success(res.message)
                        this.$emit('success')
                    })
                }
            }
        },
        mounted() {
            this.initJoblevels()
            this.initNations()
            this.initPolitics()
            this.initPositions()
            this.initSalarys()
            this.initWorkId()
        }
    }
</script>

<style scoped>

</style>
